<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Ajax-Axios</title>
</head>
<body>
    
    <input type="button" value="获取数据GET" id="btnGet">
    <input type="button" value="操作数据POST" id="btnPost">

    <div id="div1">
        <td>{{msg}}</td>
    </div>

    <script src="js/axios.js"></script>
    <script>
        //发送GET请求,  当点击按钮时，执行函数，发送get请求，访问url地址，获取数据
        document.querySelector('#btnGet').addEventListener('click', () => {
           axios({
            method: 'get',
            url: 'https://mock.apifox.cn/m1/3083103-0-default/emps/list'
           }).then((result) => {
            console.log(result.data);
          }).catch((error) => {
            console.log(error);
})
        })
        
        //发送POST请求 ， 当点击按钮时，执行函数，发送post请求
        document.querySelector('#btnPost').addEventListener('click', () => {
            axios({
                method:'POST',
                url:'https://mock.apifox.cn/m1/3083103-0-default/emps/update',
                data:'1'
            }).then((result) => {
                console.log(result.data);
            }).catch((error) => {
                console.log(error);
            })
            
        })
    </script>

    
</body>
</html>